<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width"/>
		<meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
		<title>路线规划</title>
		<link rel="stylesheet" type="text/css" href="../../css/api.css" />
		<link rel="stylesheet" type="text/css" href="../../css/sm.min.css">
		<link rel="stylesheet" href="../../css/sm-extend.min.css">
		<script type='text/javascript' src='../../script/zepto.min.js' charset='utf-8'></script>
		<script type='text/javascript' src='../../script/sm.min.js' charset='utf-8'></script>
		<script type='text/javascript' src='../../script/sm-extend.min.js' charset='utf-8'></script>
		<link rel="stylesheet" type="text/css" href="../../css/all.css">
		<link rel="stylesheet" type="text/css" href="../../css/base.css">
		<link rel="stylesheet" type="text/css" href="pathplan.css">
		<link rel="stylesheet" type="text/css" href="../../css/iconfont.css">
		<link rel="stylesheet" type="text/css" href="../../css/person/iconfont.css">
		<style>
			body {
				font-family: "微软雅黑";
			}
			a {
				color: #000;
			}
			a:active, a:link, a:visited, a:hover {
				color: #000;
				text-decoration: none;
			}
			.list-block .item-inner:after {
				content: none;
			}
			.bar {
				z-index: 0;
			}
		</style>
	</head>
	<body>
		<div class="page-group">
			<!-- 你的html代码 -->
			<div class="page">
				<header class="bar bar-nav" id="header">
					<a class="icon pull-left" id="back"><i  class="iconfont icon-xiangzuo1" style="font-size: 28px;color: #999"></i></a>
					<h1 class="title" id="title">路线规划</h1>
					<a class="top-bar-right navigation" id="navigation">导航</a>
				</header>
				<div class="content" style="background-color: #f0f0f0;">
					<div class="buttons-tab">
						<a id="a_tab1" href="#tab1" class="tab-link active button">开车</a>
						<a id="a_tab2" href="#tab2" class="tab-link button">公交</a>
						<a id="a_tab3" href="#tab3" class="tab-link button">步行</a>
					</div>
					<div class="content-block">
						<div class="tabs">
							<div id="tab1" class="tab active">
								<div class="map"></div>
								<div class="detail">
									<div class="time">
										<h3 id="costTime"></h3>
										<span id="detailOfDrive">详情 ></span>
									</div>
									<p id="costMonAll">
										打车约<span id="costMon"></span>元
									</p>
								</div>
							</div>
							<div id="tab2" class="tab">
								<div class="jili">
									<div class="changeCor" id="jili61">
										最佳路线
									</div><span style='border-right:1px solid red;'></span>
									<div id="jili121">
										步行少
									</div>
									<div id="jili241">
										换乘少
									</div>
									<div id="jili242">
										不坐地铁
									</div>
								</div>
								<div class="pathlist">
									<div class="list-block media-list">
										<ul id="ul_tab2">
										</ul>
									</div>
								</div>
							</div>
							<div id="tab3" class="tab">
								<div class="map"></div>
								<div class="detail">
									<div class="time">
										<h3 id="costTime2"></h3>
										<span id="detailOfDrive2">详情 ></span>
									</div>
									
									<p id="asaa" style="visibility: hidden">
										打车约<span id="costMon"></span>元
									</p>
								</div>
							</div>
						</div>
					</div>
				</div>
				<!--<div class="control">
					<div class="big">
						+
					</div>
					<div class="small">
						-
					</div>
				</div>-->
				<div class="hide">
					<div>
						<div class="open">
							选择您的打开方式
						</div>
						<div class="gaode">
							高德地图
						</div>
						<div class="baidu">
							百度地图
						</div>
					</div>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript" src="../../script/api.js"></script>
	<script type="text/javascript" src="../../script/common.js"></script>
	<script type="text/javascript" src="pathplan.js"></script>
	<!--<script>
	
	   $(function(){
	       var top1 = $(window).height();
	       var top2 = $('.content-block').offset().top;
	       console.log(top1);
	       console.log(top2);
	       $('.map').height(top1 - top2);
	   })
	</script>-->
</html>